<!doctype html>
<html lang="en-US">
  <head>
    <meta charset="UTF-8" />
    <style type="text/css">
      .blend {
        background-image: url("images/bear.jpg");
        background-size: cover;
        background-position: center;
        padding: 50vmin 0 1em;
      }

      .blend > h1 {
        margin: 0;
        font-family: Helvetica, Arial, sans-serif;
        font-size: 6rem;
        text-align: center;
        mix-blend-mode: hard-light;
        background-color: oklch(25% 0.2 25deg);
        color: #808080;
        border: 0.1em solid #ccc;
        border-width: 0.1em 0;
      }
    </style>
  </head>
  <body>
    <div class="blend">
      <h1>Ursa major</h1>
    </div>
  </body>
</html>
